<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>隔行换色——设置元素样式</title>  
	 <style>
		 ul{
		list-style: none;
		width: 800px;
		line-height: 30px;
		 }
		 .sty1{
			 background-color: aqua;
			 font-size: 20px;
			 font-weight: bolder;
		 }
	 </style>
</head>
<body>
    <ul id="box">
        <li>好书专递||人邮、人民网联合出品：新媒体创新人才培养系列丛书来了！</li>
        <li>重磅发布||人邮-华为物联网实践系列教材发布，助力院校培养物联网应用型人才！</li>
        <li>好书专递||AI 教材就选Arm系列了！</li>
        <li>新书速递||千呼万唤，智慧商业新形态活页式教材终于来了!</li>
        <li>新书速递||思政+在线课+培训+研讨······山大版大学数学教材全都有！</li>
        <li>教育广角|| 特殊的2020过半，教师的职业认知还能有哪些升级？</li>
    </ul>
    <script>
		var sy = document.querySelector('#box');
		var lb = sy.getElementsByTagName('li');
		for(let i=0;i<lb.length;i++){
			if(i%2==0){
				lb[i].className="sty1"
			}else{
				lb[i].style.backgroundColor="blue"
			}
		}
		
	</script>
</body>
</html>